<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>他的主页</title>
<link rel="icon" href="../img/BaiYi_title_icon.png" />
<link type="text/css" rel="stylesheet" href="../css/foundation.css" />
<link type="text/css" rel="stylesheet" href="../css/baiyi.css" />
<script type="text/javascript" src="../js/vendor/jquery.js"></script>
<script type="text/javascript" src="../js/foundation/foundation.js"></script>
<script type="text/javascript"
	src="../js/foundation/foundation.topbar.js"></script>
<script type="text/javascript"
	src="../js/foundation/foundation.offcanvas.js"></script>
<script type="text/javascript"
	src="../js/foundation/foundation.reveal.js"></script>
<script type="text/livescript"
	src="../js/foundation/foundation.equalizer.js"></script>
<script type="text/javascript"
	src="../js/foundation/foundation.dropdown.js"></script>
<script type="text/javascript">
	$(document).ready(function() {
		$(document).foundation();
		$(document).foundation('topbar', 'reflow');
		$(document).foundation('offcanvas', 'reflow');
		$(document).foundation('revaeal', 'reflow');
		$(document).foundation('equalizer', 'reflow');
		$(document).foundation('dropdown', 'reflow');
	});
</script>
</head>
<body>
	<div class="off-canvas-wrap" data-offcanvas>
		<div class="inner-wrap">
			<jsp:include page="nav.jsp"></jsp:include>
			<!-- Off Canvas Menu 显示简易个人信息 -->
			<jsp:include page="user.jsp"></jsp:include>
			<!---------------------弹窗全写在这里了---------------------->
			<!----------------------------------------------------------------------------------------->
			<!---------------------------- 内容区域可替换------------------------------------------------>
			<!----------------------------------------------------------------------------------------->
			<div
				style="background-repeat: no-repeat; background-position: center top; background-attachment: scroll; background-image: url('../img/picture/bg_top01.jpg');">
				<div class="row">
					<div class="large-9  medium-8 columns">
						<h2 style="color:#5D7895">${user.qzoneName }</h2>
						<span style="color:#5D7895;"> <c:if
								test="${empty user.qzoneAutograph }">
						您还未填写空间签名哦</c:if> <c:if test="${!empty user.qzoneAutograph }">${user.qzoneAutograph }</c:if>
							<a href="#">&nbsp;&nbsp;(http://user.qzone.baiyi.com/home)</a></span>
					</div>
				</div>
				<div class="row" style="margin-top: 20px;">
					<!--头像-->
					<div class="large-3 medium-4 columns">
						<div class="panel"
							style="width:200px; height:200px; padding:0.5rem;">
							<img style="height:182px;" src="${ user.userPortrait }"
								alt="暂无头像" />
						</div>
					</div>
					<!--标题栏-->
					<div class="large-9 medium-8 columns">
						<div class="large-9 medium-8 columns" style="padding-top:53px;">
							<span style="color:#5D7895; font-size:1.25rem;">${user.userName }</span><span
								class="lv"></span>
						</div>
						<div class="large-3 medium-4 columns">
							<form action="" method="get">
								<button class="">
									赞 &#40;
									<c:if test="${empty user.userHot }">0</c:if>
									<c:if test="${!empty user.userHot }">${user.userHot } </c:if>
									&#41;
								</button>
							</form>
							<form action="" method="get">
								<button class="small">&radic;关注他</button>
							</form>
							<div>
								<img src="../img/icon_png/weather-sunny.png" /><span
									style="margin-left:10px; color:#95D3E5;">海口&nbsp;
									&nbsp;|&nbsp; &nbsp; 晴</span>
							</div>
						</div>
						<div class="large-12  medium-12 columns" style="">
							<ul class="inline-list" style="padding-top:26px;">
								<li><a href="toOtherHome?id=${user.userId}">相册</a></li>
								<li><a href="toOtherMessageBoard?id=${user.userId}">留言板</a></li>
								<li><a href="#others_comment">最近访客</a></li>
								<li><a href="others_information_center.jsp">更多资料>></a></li>
							</ul>
						</div>
					</div>
				</div>
				<!--相册区域--------------------------------------------------->
				<div class="row" style="background-color:#F2F2F2" data-equalizer>
					<!--头部工具栏-->
					<div class="large-12 medium-12 small-12 columns">
						<hr />
						<span style="font-size:1.8125rem;">相册</span>
						<hr />
					</div>
					<!--分类相册显示-->
					<div class="album_panel_style">
						<div class="large-12 medium-12 small-12 columns">
							<c:if test="${!empty myAlbum }">
								<c:forEach items="${types }" var="type">
									<h4>${type.albumType }</h4>
									<c:forEach items="${myAlbum }" var="album">
										<c:if
											test="${type.albumTypeId eq album.tbAlbumType.albumTypeId }">
											<div class="large-2 medium-3  columns " data-equalizer-watch>
												<div class="panel">
													<a href="toOthersAlbum?id=${album.albumId }"> <img
														src="${album.showPhotoPath }" alt="暂无封面" /></a> <span>${album.albumName }</span>
												</div>
											</div>
										</c:if>
									</c:forEach>
									<hr>
								</c:forEach>
								<c:if test="${empty myAlbum }"> 暂无相册!
								</c:if>
							</c:if>
						</div>
					</div>
					<!--最近访客-->
					<div class="large-12 medium-12 small-12 columns panel">
						<span style="font-size:1.8125rem;">最近访客</span> <span
							style="font-size:0.8125rem; color:#5D7895">|访问总数：<c:if
								test="${empty user.visitorSize }">0</c:if> <c:if
								test="${!empty user.visitorSize }">${ user.visitorSize }</c:if>
						</span>
						<hr />
						<div class="recent_visitor">
							<ul class="inline-list">
								<c:forEach items="${myVisitor }" var="visitor">
									<li><img src="${visitor.tbUserByVisitorId.userPortrait }"
										alt="暂无头像" /> <span><fmt:formatDate
												value="${visitor.visitTime }" /> </span></li>
								</c:forEach>
							</ul>
						</div>
					</div>
				</div>
				<!----------------------------------------------------------------------------------------->
				<!---------------------------- 内容区域------end-------------------------------------------->
				<!----------------------------------------------------------------------------------------->
				<!------------------页脚--------------------->
				<jsp:include page="footer.jsp"></jsp:include>
				<!-- close the off-canvas menu -->
				<a class="exit-off-canvas"></a>
			</div>
		</div>
	</div>
</body>
</html>